// src/store/modules/pexels.ts
import { getPexelsListApi } from '@/apis/index.js';
import { CategoryCache, PexelsItem, PexelsQuery } from '@/types/index.js';
import { defineStore } from 'pinia';

export const PEXELS_PAGE_SIZE = 10;

export const usePexelsStore = defineStore('pexels', {
  state: (): {
    // 使用 Map 结构作为我们的“档案柜”
    // Key 是 categoryId (string), Value 是该分类的所有状态 (CategoryCache)
    cache: Map<string, CategoryCache>;
    // 全局加载状态，表示任何一个请求正在进行中
    isLoading: boolean;
    itemDetail:PexelsItem | null;
  } => ({
    cache: new Map(),
    isLoading: false,
    itemDetail:null,
  }),

  getters: {
    /**
     * 根据分类 ID 获取列表数据。
     * Getter 现在需要接收参数来指定要获取哪个分类的数据。
     */
    getListByCategoryId: (state) => (categoryId: string): PexelsItem[] => {
      return state.cache.get(categoryId)?.list || [];
    },
    /**
     * 根据分类 ID 获取是否加载完成的状态。
     */
    getFinishedStateByCategoryId: (state) => (categoryId: string): boolean => {
      return state.cache.get(categoryId)?.isFinished || false;
    },
    /**
     * 根据分类 ID 获取滚动位置。
     */
    getScrollTopByCategoryId: (state) => (categoryId: string): number => {
      return state.cache.get(categoryId)?.scrollTop || 0;
    },
    /**
     * 辅助 Getter：检查某个分类是否已经有缓存数据。
     * 这能让组件中的逻辑更清晰。
     */
    hasDataFor: (state) => (categoryId: string): boolean => {
      const data = state.cache.get(categoryId);
      return !!data && data.list.length > 0;
    },
  },

  actions: {

    setItemDetail(item:PexelsItem){
      this.itemDetail = item
    },

    /**
     * 内部辅助 action，确保任何分类都有一个初始化的缓存条目。
     * 避免在多个地方重复写初始化逻辑。
     * @param categoryId 分类ID
     */
    _ensureCache(categoryId: string) {
      if (!this.cache.has(categoryId)) {
        this.cache.set(categoryId, {
          list: [],
          total: 0,
          page: 1,
          scrollTop: 0,
          isFinished: false,
        });
      }
    },

    /**
     * 刷新或首次加载列表。
     * @param categoryId 要刷新的分类ID
     * @param force 可选，是否强制刷新（用于手动下拉刷新）
     */
    async refreshList(categoryId: string, force: boolean = false) {
      // 守卫：如果正在加载，或者非强制模式下已有数据，则不执行
      if (this.isLoading || (this.hasDataFor(categoryId) && !force)) {
        return;
      }
      
      this.isLoading = true;
      try {
        this._ensureCache(categoryId); // 确保有缓存对象
        const categoryState = this.cache.get(categoryId)!;

        // 重置该分类的状态
        categoryState.page = 1;
        categoryState.isFinished = false;
        
        const query: PexelsQuery = {
          categoryId: categoryId,
          page: categoryState.page,
          size: PEXELS_PAGE_SIZE,
        };
        const res = await getPexelsListApi(query);
        
        // 更新该分类的数据
        categoryState.list = res.list;
        categoryState.total = res.total;
        
        if (res.list.length >= res.total) {
          categoryState.isFinished = true;
        }

      } catch (error) {
        console.error("Refresh failed:", error);
      } finally {
        this.isLoading = false;
      }
    },

    /**
     * 加载更多数据。
     * @param categoryId 要加载更多的分类ID
     */
    async loadMore(categoryId: string) {
      const categoryState = this.cache.get(categoryId);
      // 守卫：如果正在加载、没有缓存对象或已全部加载完毕，则不执行
      if (this.isLoading || !categoryState || categoryState.isFinished) {
        return;
      }

      this.isLoading = true;
      try {
        // 页码 +1，为下一次加载做准备
        categoryState.page++;

        const query: PexelsQuery = {
          categoryId: categoryId,
          page: categoryState.page,
          size: PEXELS_PAGE_SIZE
        };
        const res = await getPexelsListApi(query);
        
        // 追加数据而不是替换
        categoryState.list.push(...res.list);
        categoryState.total = res.total; // total 可能也会变，最好更新一下
        
        if (categoryState.list.length >= categoryState.total) {
          categoryState.isFinished = true;
        }

      } catch (error) {
        console.error('Failed to load more data:', error);
      } finally {
        this.isLoading = false;
      }
    },

    /**
     * 新增 action：保存指定分类的滚动位置。
     * @param categoryId 分类ID
     * @param scrollTop 滚动条位置
     */
    saveScrollPosition(categoryId: string, scrollTop: number) {
      if (this.cache.has(categoryId)) {
        this.cache.get(categoryId)!.scrollTop = scrollTop;
      }
    },
  },
});
